import React from 'react';
import { connect } from 'dva';
import { Select } from 'antd';
const Option = Select.Option;;


/**
 * [FundSelect 基金选择框]
 */
class FundSelect extends React.Component {
	state = {
		data: this.props.fundSelectList,
		value: this.props.fund,
	}
	componentDidMount() {
		this.fetchData(this.props)
	}
	componentWillReceiveProps(nextProps) {
		if(nextProps.fundSelectList!==this.props.fundSelectList){
      const data = nextProps.fundSelectList
      data.unshift({
        name: "全部",
        id: "total"
      })
      this.setState({
        data,
      })
    }
	}

	fetchData=(props)=>{
		props.dispatch({
			type: `periodReplay/getGroupDefinitionList`,
			payload:props
		})
	}
	
	handleChange = (value) => {
		console.log('FundSelect>',value)
		this.setState({
			value,
		})
		this.changeRouter(value)
	}
	changeRouter(traderVal) {
		//  保存查询参数到URL
		const payload=this.props.location
		payload.query.fund=traderVal
		this.props.dispatch({
			type: `app/changeRouter`,
			payload
		})
	}
	render() {
		
		const { value,data } = this.state;
		console.log('FundSelect>data',this.state,this.props)
		return (
			<Select
				showSearch
				style={{ width: 120 }}
				value={value}
				optionFilterProp="children"
				onChange={this.handleChange.bind(this)}
				filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
			>
				{
					this.props.fundSelectList.map((item, index) => <Option value={item.id} key={index}>{item.name}</Option>)
				}
			</Select>
		)
	}
}
FundSelect.defaultProps={
	//开始时间 => begindate
	begindate:null, 
	//结束时间 => enddate
	enddate:null, 
	//基金列表 => fundSelectList
	fundSelectList:[], 
	//当前基金 => fund
	fund:'total', 
	//当前路由 => location
	location:{
		pathname:'/tradeReplay/periodReplay',
		query:{},
	},
}

export default connect()(FundSelect)
